<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>西瓜生活</title>
<link type="text/css" href="css/sell.css" rel="stylesheet" />
<link type="text/css" href="css/common.css" rel="stylesheet" />
<link type="text/css" href="css/reset.css" rel="stylesheet" />
    <link type="text/css" href="theme-chalk/index.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script><!--必须得放在第一的位置-->
    <script type="text/javascript" src="js/sell.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script type="text/javascript" src="js/axios.js"></script>
    <script type="text/javascript" src="js/vue.js"></script>
    <script type="text/javascript" src="js/esc.js"></script>
    <script src="js/element-ui-index.js"></script>
</head>

<body>
<div id="app">
<div class="index">
  <myframe>
  <div class="user_content f_f width_1200_center">
    <div class="content_position">您当前的位置：<a href="javascript:">首页</a><span>&gt;</span><a href="javascript:">卖车</a></div>
   <!-- <div class="user_content_top f_z15"><a href="#">注册会员</a><span>Register</span></div>-->
    <!--<div class="content_goods_cart_top over_hidden">
      <div class="top_cart top_recommend fl">网上自己卖</div>
      <div class="top_cart top_know fl">找商家卖</div>
      <div class="top_cart top_story fl">置换卖</div>
      <div class="top_all fr"><span class="span1"></span><span class="span2"></span></div>
    </div>-->
    <!--以后复制的开始--> 
    <div class="hr_5"></div>
    <div class="buy_content_li_list width_1200_center buy_content_li_list1 over_hidden clearfix">
      <div class="list_top">填写您的二手车信息<em>|</em><span class="span1">网上自己卖</span></div>
      <hr size="1" width="98%" color="#8BBAD9" />
      <div class="hr_8"></div>
      <div class="list_con ">
        <div class="con_1 con_ over_hidden">
          <div class="con_l_type1 width_size1 fl"><em>*</em>选择车型：</div>
          <div class="con_l_type2 fl">
            <select v-model="carMessage.type" name="" id="">
            	<option value="">请选择</option>
                <option value="奥迪"><a href="javascript:void(0)">A&nbsp;奥迪</a></option>
                <option value="奔驰"><a href="javascript:void(0)">B&nbsp;奔驰</a></option>
                <option value="宝马"><a href="javascript:void(0)">B&nbsp;宝马</a></option>
                <option value="标致"><a href="javascript:void(0)">B&nbsp;标致</a></option>
                <option value="比亚迪"><a href="javascript:void(0)">B&nbsp;比亚迪</a></option>
                <option value="本田"><a href="javascript:void(0)">B&nbsp;本田</a></option>
                <option value="保时捷"><a href="javascript:void(0)">B&nbsp;保时捷</a></option>
                <option value="宾利"><a href="javascript:void(0)">B&nbsp;宾利</a></option>
                <option value="别克"><a href="javascript:void(0)">B&nbsp;别克</a></option>
                <option value="宝骏"><a href="javascript:void(0)">B&nbsp;宝骏</a></option>
                <option value="长城"><a href="javascript:void(0)">C&nbsp;长城</a></option>
                <option value="大众"><a href="javascript:void(0)">D&nbsp;大众</a></option>
                <option value="东风"><a href="javascript:void(0)">D&nbsp;东风</a></option>
                <option value="丰田"><a href="javascript:void(0)">F&nbsp;丰田</a></option>
                <option value="福特"><a href="javascript:void(0)">F&nbsp;福特</a></option>
                <option value="法拉利"><a href="javascript:void(0)">F&nbsp;法拉利</a></option>
                <option value="广汽中兴"><a href="javascript:void(0)">G&nbsp;广汽中兴</a></option>
                <option value="黑豹"><a href="javascript:void(0)">H&nbsp;黑豹</a></option>
                <option value="捷豹"><a href="javascript:void(0)">J&nbsp;捷豹</a></option>
                <option value="凯迪拉克"><a href="javascript:void(0)">K&nbsp;凯迪拉克</a></option>
                <option value="卡威"><a href="javascript:void(0)">K&nbsp;卡威</a></option>
                <option value="铃木"><a href="javascript:void(0)">L&nbsp;铃木</a></option>
                <option value="劳斯莱斯"><a href="javascript:void(0)">L&nbsp;劳斯莱斯</a></option>
                <option value="兰博基尼"><a href="javascript:void(0)">L&nbsp;兰博基尼</a></option>
                <option value="雷克萨斯"><a href="javascript:void(0)">L&nbsp;雷克萨斯</a></option>
                <option value="路虎"><a href="javascript:void(0)">L&nbsp;路虎</a></option>
                <option value="马自达"><a href="javascript:void(0)">M&nbsp;马自达</a></option>
                <option value="迈巴赫"><a href="javascript:void(0)">M&nbsp;迈巴赫</a></option>
                <option value="讴歌"><a href="javascript:void(0)">O&nbsp;讴歌</a></option>
                <option value="奇瑞"><a href="javascript:void(0)">Q&nbsp;奇瑞</a></option>
                <option value="日产"><a href="javascript:void(0)">R&nbsp;日产</a></option>
                <option value="荣威"><a href="javascript:void(0)">R&nbsp;荣威</a></option>
                <option value="三菱"><a href="javascript:void(0)">S&nbsp;三菱</a></option>
                <option value="天马"><a href="javascript:void(0)">T&nbsp;天马</a></option>
                <option value="五菱"><a href="javascript:void(0)">W&nbsp;五菱</a></option>
                <option value="雪铁龙"><a href="javascript:void(0)">X&nbsp;雪铁龙</a></option>
                <option value="现代"><a href="javascript:void(0)">X&nbsp;现代</a></option>
                <option value="雪佛兰"><a href="javascript:void(0)">X&nbsp;雪佛兰</a></option>
                <option value="云豹"><a href="javascript:void(0)">Y&nbsp;云豹</a></option>
                <option value="中华"><a href="javascript:void(0)">Z&nbsp;中华</a></option>
                <option value="众泰"><a href="javascript:void(0)">Z&nbsp;众泰</a></option>
              	</option>
             </select>
          </div>
          <div class="wr_5 fl"></div>
          <div class="con_l_type3 fl">
            <select v-model="carMessage.carName" name="" id="">
                <option value="">请选择</option>
                <option value="奥迪 奥迪Q5L 2018款 40 TFSI 荣享时尚型"><a href="javascript:void(0)">A&nbsp;奥迪 奥迪Q5L 2018款 40 TFSI 荣享时尚型</a></option>
                <option value="奥迪 奥迪A4L 2020款 40 TFSI 时尚动感型"><a href="javascript:void(0)">B&nbsp;奥迪 奥迪A4L 2020款 40 TFSI 时尚动感型</a></option>

            </select>
          </div>
          <div class="wr_5 fl"></div>

        </div>

        <div class="con_5 con_ hei_line over_hidden">
          <div class="con_5_type1 width_size1 fl"><em>*</em>行驶里程：</div>
          <div class="con_5_type2 width_size2 fl"><input v-model="carMessage.traveled" id="" class="mile_" type="text" value="" maxlength="25" size="25" autocomplete="off"><span class="span1">&nbsp;万公里</span><span class="mile_ms text_te"></span></div>
        </div>
<!--        <div class="con_6 con_ over_hidden">-->
<!--          <div class="con_6_type1 width_size1 fl"><em>*</em> 首次上牌时间：</div>-->
<!--          <div class="con_6_type2 width_size2 fl"><select v-model="carMessage.date" name="" class="" id=""><option value="0" disabled="" >请选择：</option><option value="2016" selected="selected">2016</option><option value="2015">2015</option><option value="2014">2014</option><option value="2013">2013</option><option value="2012">2012</option><option value="2011">2011</option><option value="2010">2010</option><option value="2009">2009</option><option value="2008">2008</option><option value="2007">2007</option><option value="2006">2006</option><option value="2005">2005</option><option value="2004">2004</option><option value="2003">2003</option><option value="2002">2002</option><option value="2001">2001</option><option value="2000">2000</option><option value="1999">1999</option><option value="1998">1998</option><option value="1997">1997</option><option value="1996">1996</option><option value="1995">1995</option><option value="1994">1994</option><option value="1993">1993</option><option value="1992">1992</option><option value="1991">1991</option><option value="1990">1990</option><option value="1989">1989</option><option value="1988">1988</option><option value="1987">1987</option><option value="1986">1986</option><option value="1985">1985</option><option value="1984">1984</option><option value="1983">1983</option><option value="1982">1982</option><option value="1981">1981</option><option value="1980">1980</option><option value="1979">1979</option><option value="1978">1978</option><option value="1977">1977</option><option value="1976">1976</option><option value="1975">1975</option><option value="1974">1974</option><option value="1973">1973</option><option value="1972">1972</option><option value="1971">1971</option><option value="1970">1970</option><option value="1969">1969</option><option value="1968">1968</option><option value="1967">1967</option><option value="1966">1966</option><option value="1965">1965</option><option value="1964">1964</option><option value="1963">1963</option><option value="1962">1962</option><option value="1961">1961</option><option value="1960">1960</option><option value="1959">1959</option><option value="1958">1958</option><option value="1957">1957</option><option value="1956">1956</option><option value="1955">1955</option><option value="1954">1954</option><option value="1953">1953</option><option value="1952">1952</option><option value="1951">1951</option><option value="1950">1950</option><option value="1949">1949</option><option value="1948">1948</option><option value="1947">1947</option><option value="1946">1946</option><option value="1945">1945</option><option value="1944">1944</option><option value="1943">1943</option><option value="1942">1942</option><option value="1941">1941</option><option value="1940">1940</option><option value="1939">1939</option><option value="1938">1938</option><option value="1937">1937</option><option value="1936">1936</option><option value="1935">1935</option><option value="1934">1934</option><option value="1933">1933</option><option value="1932">1932</option><option value="1931">1931</option><option value="1930">1930</option></select><label class="ml5 mr5">年</label><select name="" class="selt selt1" id="birthdayMonth"><option value="0" disabled="" >请选择：</option><option value="1" selected="selected">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option></select><label class="ml5 mr5">月</label><select name="" class="selt selt1" id="birthdayDay"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option></select><label class="ml5 mr5">日</label>&nbsp;&nbsp;<label class="label1"><input name="" type="checkbox" value="1">未上牌</label></div>-->
<!--        </div>-->
          <div class="con_7 con_ hei_line over_hidden">
              <div class="con_7_type1 width_size1 fl"><em>*</em>新车价格：</div>
              <div class="con_7_type2 width_size2 fl"><input v-model="carMessage.newPrice" id="" class="price_" type="text" value="" size="25" autocomplete="off"><span class="span1">&nbsp;万元</span><span class="price_ms text_te"></span></div>
          </div>
        <div class="con_7 con_ hei_line over_hidden">
          <div class="con_7_type1 width_size1 fl"><em>*</em>预售价格：</div>
          <div class="con_7_type2 width_size2 fl"><input v-model="carMessage.oldPrice" id="" class="price_" type="text" value="" size="25" autocomplete="off"><span class="span1">&nbsp;万元</span><span class="price_ms text_te"></span></div>
        </div>
        <hr size="1" width="90%"  color="#8BBAD9" />       
        <div class="con_8 con_ over_hidden">
          <div class="con_8_type1 width_size1 fl">车辆实拍照片：</div>
          <div class="con_8_type2 width_size2 fl">
              <div class="con_con fl"><img :src="image" width="80" height="80" /></div>
              <input type="file" @change="sendImg" accept="image/*" id="file"
                     style="display: none">
              <div class="con_head fl" @click.prevent="changetx"><a>上传图片</a></div>
<!--              <div>上传实拍照片可提高一倍售出成功率，最多上传 10 张</div>-->
          </div>
        </div>        
        <div class="con_9 con_ over_hidden">
          <div class="con_9_type1 width_size1 fl">车主自述：</div>
          <div class="con_9_type2 width_size2 fl"><textarea  v-model="carMessage.introduction" name="txtStateDescription" rows="6" cols="70" id="txtStateDescription" class="selectall sp_text1"></textarea></div>
        </div>        
        <hr size="1" width="90%"  color="#8BBAD9" />
        <div class="con_10 con_ hei_line over_hidden">
          <div class="con_10_type1 width_size1 fl"><em>*</em>联系人：</div>
          <div class="con_10_type2 width_size2 fl"><input v-model="user.username" id="" class="name_" type="text" value="" autocomplete="off" size="25"><span class="name_ms text_te"></span></div>
        </div>
        <div class="con_11 con_ hei_line over_hidden">
          <div class="con_11_type1 width_size1 fl"><em>*</em>手机号：</div>
          <div class="con_11_type2 width_size2 fl"><input v-model="user.phone" id="" class="mobile_email_" type="text" value="" autocomplete="off" size="25">
              <span class="mobile_email_ms text_te"></span>
          </div>
        </div>
        <!--<div class="con_12 con_ hei_line over_hidden">
          <div class="con_12_type1 width_size1 fl"><em>*</em>验证码：</div>
          <div class="con_12_type2 width_size2 fl"><input id="" class="catcha_" type="text" value="" autocomplete="off" size="25"><span class="catcha_ms text_te"></span></div>
        </div>-->
        <div class="con_13 con_ hei_line over_hidden">
          <div class="con_13_type1 width_size1 fl"><em>*</em>邮箱：</div>
          <div class="con_13_type2 width_size2 fl"><input v-model="user.email" id="" class="weixin_" type="text" value="" autocomplete="off" size="25"><span class="weixin_ms text_te"></span><!--&nbsp;<span class="span1"></span>--></div>
        </div>

        <hr size="1" width="90%"  color="#8BBAD9" />

        <div @click.prevent="op" class="con_21 con_ over_hidden"><a class="a1" href="javascript:void(0)">发布车源</a></div>
        <div class="list_bottom">卖车指南</div>
        <hr size="1" width="98%" color="#8BBAD9" />
        <div class="list_bottom_con">
          <h1>C1：卖车流程是怎样的？</h1>
          <div class="con_txt">
            <p>1、在本页填写卖车信息或拨打18877829596联系我们。</p>
            <p>2、接受评估师专业的上门质检，定出售价。</p>
            <p>3、交易专员带领买家上门看车。</p>
            <p>4、达成交易协议，西瓜二手车店帮你办过户。</p>
          </div>
        </div>
        <div class="list_bottom_con">
          <h1>C2：卖车需要准备什么？</h1>
          <div class="con_txt">
            <table>
              <tr>
                  <td>身份证</td>
                  <td>环保标</td>
                  <td>购置税本</td>
              </tr>
              <tr>
                  <td>行驶证</td>
                  <td>检字标</td>
                  <td>购置税发票</td>
              </tr>
              <tr>
                  <td>车辆登记证</td>
                  <td>交强险标</td>
                  <td>购车发票/最近一次过户发票</td>
              </tr>
              <tr>
                  <td></td>
                  <td>交强险单</td>
                  <td></td>
              </tr>
            </table>
          </div>
        </div>
        <div class="list_bottom_con">
          <h1>C3：大概多久能成交？</h1>
          <div class="con_txt">
            <p>大部分车辆在瓜子二手车直卖网上只需一周就可成交。</p>
          </div>
        </div>
        <div class="list_bottom_con">
          <h1>C4：是否收取费用？</h1>
          <div class="con_txt">
            <p>瓜子二手车直卖网不会收取卖家任何费用，交易达成才会向买家收取不超过交易金额3%的服务费。 </p>
          </div>
        </div>
        <div class="hr_10"></div>
      </div>
      
    </div><!--遍历内容部分完-->
    <div class="buy_content_li_list width_1200_center buy_content_li_list2 over_hidden display_n clearfix">
      
    </div><!--遍历内容部分完-->
    <div class="buy_content_li_list width_1200_center buy_content_li_list3 over_hidden display_n clearfix">
     
    </div><!--遍历内容部分完-->
    <!--以后复制的结束-->   
  </div><!--整个内容部分-->
  
 
 
 
 
 
  <div class="hr_8"></div>
  </myframe>
</div>
</div>
<script>
    var v = new Vue({
        el : "#app",
        data : {
            carMessage : {},
            user : [],
            image : "",
            path: ""
        },
        created() {
            this.getLoginedUser();
        },
        methods : {
            //获取用户信息
            getLoginedUser() {
                axios.get("/esc-user/getLoginedUser").then(res => {
                    if (res.data.code) {
                        console.log(res.data.data);
                        this.user = res.data.data;
                        this.queryCar();
                        this.carOrderAll();

                    }
                })
            },

            changetx(){
                file.click(); //触发文件选择框点击事件
            },
            sendImg(){
                if (file.files == 0){
                    alert("请选择上传的图片");
                    return;
                }
                //上传图片 =》返回图片地址
                var fd = new FormData();
                fd.append("file",file.files[0]);
                var uid = this.user.uid;
                axios.post("/esc-user/upload",fd).then(res=>{
                    var img = res.data.data;
                    this.path=img;
                    this.image="/esc-user"+ img;
                    console.info(res.data.data)

                });
            },

            fabucheyuan() {
                // var p = new URLSearchParams();
                this.carMessage.uid = this.user.uid;
                this.carMessage.image = this.path;
                console.log( this.carMessage );
                axios.post("esc-order/esc/carMessage/fabucheyuan",  this.carMessage).then(res=>{

                })
            },
            op() {
                this.$confirm('是否要将该车辆发布, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$message({
                        type: 'success',
                        message: '发布成功!'
                    });
                    this.fabucheyuan()
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消发布'
                    });
                });
            },
        }
    })
</script>
</body>
</html>